<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
		<title>管理选项</title>
		<!-- Bootstrap -->
		<link href="../assets/css/bootstrap.min.css" rel="stylesheet">
		<link href="fonts/iconfont.css" rel="stylesheet">
		<link href="../assets/css/style.css" rel="stylesheet" />
		<link href="../assets/css/motai.css" rel="stylesheet" />
		<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
		      <script src="../assets/js/html5shiv.min.js"></script>
		      <script src="../assets/js/respond.min.js"></script>
		      <![endif]-->
		      <style type="text/css">
		        .mendian-list{
		          margin-top: 20px;
		        }
		      </style>
	</head>

	<body>
		<!--内容区域-->
		<div class="content">
			<div class="content-header col-md-12">
				<div class="con-header">
					<div class="col-md-6 col-sm-6 col-xs-6">
						<button type="button" class="btn btn-info btn-header" data-toggle="modal" data-target="#myModal">添加+</button>
					</div>
				</div>
			</div>

		</div>

		<!-- 模态框（Modal） -->

		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content height370">
					<!-- 管理选项 -->
					<div class="modal-header">
						<div class="zuo-close" data-dismiss="modal">
							<i class="iconfont icon-o1"></i>
						</div>
						<h5 class="modal-title" id="myModalLabel"><i class="iconfont icon-shezhi"></i>&emsp;管理回话</h5>
					</div>
					<div class="modal-body height260">
						<div class="row">
						  <div class="shangjia-list">
                <div class="col-sm-12"><span class="shubiao"></span>商家</div>
                <div class="merchant">
                  <div class="col-sm-2 col-xs-5 buiss_style_quanxian">最高权限</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">农家菜1</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">农家菜1</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">农家菜1</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">农家菜1</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">农家菜1</div>
                </div>
              </div>
              <div class="clear" style="clear:both"></div>
							<div class="mendian-list hidden mt20">
                <div class="col-sm-12"><span class="shubiao"></span>门店</div>
                <div class="merchant">
                  <div class="col-sm-2 col-xs-5 buiss_style">门店1</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">门店2</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">门店3</div>
                  <div class="col-sm-2 col-xs-5 buiss_style">门店4</div>
                </div>
              </div>
							
						</div>
					</div>

					<div class="modal-footer guanli_foot">
						<button type="button" class="btn close_motai" data-dismiss="modal">确定</button>
					</div>

				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
		</div>

		<script src="../assets/js/jquery.min.js"></script>
		<script src="../assets/js/bootstrap.min.js"></script>
		<script src="../assets/js/main.js"></script>
		<script type="text/javascript">
			$(".buiss_style").on('click',function(){
			  $(this).siblings().removeClass('bg-color');
			  $(this).parent().parent().siblings('.mendian-list').removeClass('hidden');
			})
		</script>

	</body>

</html>